<template>
	<view class="flex-col page">
		<view class="flex-col group_5">
			<view class="flex-col">
				<view class="flex-col section_1">
					<view class="flex-row">
						<image :src="data.avatar" class="image_6" />
						<view class="flex-col group_8">
							<view class="flex-row">
								<text class="text_6">昵称：{{data.nickname}}</text>
								<!-- <view class="flex-col items-center group_10">
									<image
										src="http://images.wanjunshijie.com/product/cook/assets/2aa6eac29ba8e5af726f5fb23fcd8c42.png"
										class="image_7" />
									<text class="text_7">初级</text>
								</view> -->
								<!-- <image
									src="http://images.wanjunshijie.com/product/cook/assets/4542d3fd4ad648db37bc0e6937b7aae7.png"
									class="image_8" /> -->
							</view>
							<!-- <text class="text_8">电话：{{data.mobile}}</text> -->
						</view>
					</view>
					<view v-if="data.group_id==2" class="justify-end group_11">
						<u-switch space="1" :disabled="true" size="10" v-model="data.is_online" activeColor="#f9ae3d"
							inactiveColor="rgb(230, 230, 230)">
						</u-switch>
						<text>{{data.is_online?'上线':'离线'}}</text>
					</view>
				</view>
				<view class="flex-col section_2">
					<view @click="goaddress()" class="justify-between group_12">
						<view class="flex-row">
							<image src="http://images.wanjunshijie.com/product/cook/assets/16419689640464292813.png"
								class="image_10" />
							<text class="text_10">我的地址</text>
						</view>
						<image
							src="http://images.wanjunshijie.com/product/cook/assets/076a2fcaaf3012b260dd15843deec562.png"
							class="image_11 image_12" />
					</view>
					<view class="flex-col">
						<customerService>
							<view class="justify-between group_15">
								<view class="flex-row">
									<image
										src="http://images.wanjunshijie.com/product/cook/assets/f0dde456aa4ea9438e36247c6236f5d1.png"
										class="image_13" />
									<text class="text_11">联系客服</text>
								</view>
								<image
									src="http://images.wanjunshijie.com/product/cook/assets/076a2fcaaf3012b260dd15843deec562.png"
									class="image_11 image_14" />
							</view>
						</customerService>
						<view class="flex-col">
							<view @click="goabout" class="justify-between group_18">
								<view class="flex-row">
									<image
										src="http://images.wanjunshijie.com/product/cook/assets/07cf3e531313fa52d5c4ac25268e1244.png"
										class="image_15" />
									<text class="text_12">关于我们</text>
								</view>
								<image
									src="http://images.wanjunshijie.com/product/cook/assets/076a2fcaaf3012b260dd15843deec562.png"
									class="image_11 image_16" />
							</view>
							<view @click="gobank" class="justify-between group_20">
								<view class="flex-row group_21">
									<image
										src="http://images.wanjunshijie.com/product/cook/assets/16419689640470165003.png"
										class="image_17" />
									<text class="text_13">绑定银行卡</text>
								</view>
								<view class="right-group flex-row view">
									<text class="text_14">{{data.is_bind?'已绑定':'未绑定'}}</text>
									<image
										src="http://images.wanjunshijie.com/product/cook/assets/076a2fcaaf3012b260dd15843deec562.png"
										class="image_11 image_18" />
								</view>
							</view>
							<view @click="tixian()" class="justify-between group_22">
								<view class="flex-row group_23">
									<image
										src="http://images.wanjunshijie.com/product/cook/assets/684140700370a9fcdc63640451041f21.png"
										class="image_19" />
									<text class="text_16">余额提现</text>
								</view>
								<view class="right-group flex-row view_1">

									<text class="text_14">{{data.money}}</text>
									<image
										src="http://images.wanjunshijie.com/product/cook/assets/076a2fcaaf3012b260dd15843deec562.png"
										class="image_11 image_20" />
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="flex-col section_3">
					<view @click="cookapply" class="justify-between group_24">
						<view class="flex-row">
							<image
								src="http://images.wanjunshijie.com/product/cook/assets/e3ae814d0af7fb1e6a8148de95dd52a4.png"
								class="image_21" />
							<text class="text_18">申请成为厨师</text>
						</view>
						<image
							src="http://images.wanjunshijie.com/product/cook/assets/076a2fcaaf3012b260dd15843deec562.png"
							class="image_11 image_22" />
					</view>
					<view @click="gohelp()" class="justify-between group_26">
						<view class="flex-row">
							<view class="flex-col text-wrapper">
								<text>?</text>
							</view>
							<text class="text_20">使用帮助</text>
						</view>
						<image
							src="http://images.wanjunshijie.com/product/cook/assets/076a2fcaaf3012b260dd15843deec562.png"
							class="image_11 image_23" />
					</view>
				</view>
			</view>
			<view class="flex-row group_28">
				<text @click="tousu" class="text_21">投诉反馈</text>
				<view class="section_4"> </view>
				<text class="text_22" @click="logout">退出登录</text>
			</view>
		</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	import {
		logout,
		userindex
	} from '../../config/api.js'
	import customerService from '../../components/customerService.vue'
	export default {
		components: {
			customerService
		},
		data() {
			return {
				data: {
					avatar: "",
					bankaccount: "",
					bankname: "",
					group_id: 0,
					is_bind: 0,
					is_online: 0,
					money: "0",
					mobile: '',
					nickname: "",
					realname: "",
				}
			};
		},
		mounted() {
			this.userindex()
		},
		methods: {
			gohelp() {
				uni.navigateTo({
					url: '/pages/help/help'
				})
			},
			cookapply() {
				uni.navigateTo({
					url: '/pages/cook/apply'
				})
			},
			tousu() {
				uni.navigateTo({
					url: '/pages/feedback/feedback'
				})
			},
			tixian() {
				uni.navigateTo({
					url: '/pages/withdrawal/withdrawal'
				})
			},
			gobank() {
				if (this.data.is_bind == 0) {
					uni.navigateTo({
						url: '/pages/bank/add'
					})
				} else {
					uni.showToast({
						title: '已绑定银行卡,如需修改请联系客服',
						icon: 'none'
					});
				}
			},
			goabout() {
				uni.navigateTo({
					url: '/pages/about/about'
				})
			},
			goaddress() {
				uni.navigateTo({
					url: '/pages/address/list'
				})
			},
			showToast(params) {
				this.$refs.uToast.show({
					...params,
					complete() {
						params.url && uni.reLaunch({
							url: params.url
						})
					}
				})
			},
			logout() {
				var that = this;
				logout({}, {
					custom: {
						auth: true
					}
				}).then(res => {
					if (res.code == 1) {
						that.showToast({
							type: 'default',
							title: '提示',
							message: "退出成功",
							url: '/pages/login/login',
						})
					}
				}).catch(err => {

				})
			},
			userindex() {
				var that = this;
				userindex({}, {
					custom: {
						auth: true
					}
				}).then(res => {
					if (res.code == 1) {
						that.data = res.data
					}
				}).catch(err => {

				})
			},
		}
	};
</script>

<style scoped lang="scss">
	.page {
		background-color: rgb(242, 242, 242);
		width: 100%;
		height: 100%;
		overflow-y: auto;

		.group_5 {
			padding-bottom: 136rpx;
			flex: 1 1 auto;
			overflow-y: auto;

			.group_28 {
				margin-top: 56rpx;
				color: rgb(200, 132, 5);
				font-size: 24rpx;
				line-height: 23rpx;
				white-space: nowrap;

				.text_21 {
					margin-left: 245rpx;
				}

				.section_4 {
					margin-left: 20rpx;
					width: 2rpx;
					height: 22rpx;
					border: solid 2rpx rgb(200, 132, 5);
				}

				.text_22 {
					margin-left: 34rpx;
				}
			}

			.section_1 {
				padding: 50rpx 11rpx 15rpx 18rpx;
				background-color: rgb(255, 255, 255);

				.group_11 {
					margin-top: 23rpx;
					color: rgb(172, 170, 170);
					font-size: 24rpx;
					line-height: 24rpx;
					white-space: nowrap;

					.image_9 {
						margin: 4rpx 10rpx 6rpx 0;
						width: 23rpx;
						height: 14rpx;
					}
				}

				.image_6 {
					width: 100rpx;
					height: 100rpx;
				}

				.group_8 {
					margin-left: 56rpx;
					align-self: center;
					width: 268rpx;

					.text_8 {
						margin-top: 24rpx;
						color: rgb(71, 71, 71);
						font-size: 24rpx;
						line-height: 24rpx;
						white-space: nowrap;
					}

					.text_6 {
						color: rgb(0, 0, 0);
						font-size: 30rpx;
						line-height: 28rpx;
						white-space: nowrap;
						max-width: 200px;
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
					}

					.group_10 {
						margin-left: 25rpx;
						margin-top: 9rpx;
						color: rgb(255, 255, 255);
						font-size: 16rpx;
						line-height: 16rpx;
						white-space: nowrap;
						width: 51rpx;
						position: relative;

						.image_7 {
							width: 48rpx;
							height: 21rpx;
						}

						.text_7 {
							position: absolute;
							right: 0;
							top: 3rpx;
						}
					}

					.image_8 {
						margin-left: -68rpx;
						width: 24rpx;
						height: 30rpx;
					}
				}
			}

			.section_2 {
				margin-top: 16rpx;
				padding: 43rpx 22rpx 0 25rpx;
				background-color: rgb(255, 255, 255);

				.group_12 {
					padding: 0 2rpx 26rpx 4rpx;
					color: rgb(0, 0, 0);
					font-size: 28rpx;
					line-height: 26rpx;
					white-space: nowrap;
					border-bottom: solid 2rpx rgb(238, 238, 238);

					.image_12 {
						margin: 10rpx 0 9rpx;
					}

					.image_10 {
						width: 33rpx;
						height: 39rpx;
					}

					.text_10 {
						margin: 6rpx 0 7rpx 24rpx;
					}
				}

				.group_15 {
					padding: 32rpx 0 27rpx;
					color: rgb(0, 0, 0);
					font-size: 28rpx;
					line-height: 27rpx;
					white-space: nowrap;
					border-bottom: solid 2rpx rgb(238, 238, 238);

					.image_14 {
						margin: 10rpx 0;
					}

					.image_13 {
						width: 39rpx;
						height: 40rpx;
					}

					.text_11 {
						margin: 6rpx 0 8rpx 21rpx;
					}
				}

				.group_18 {
					padding: 32rpx 2rpx 28rpx;
					color: rgb(0, 0, 0);
					font-size: 28rpx;
					line-height: 27rpx;
					white-space: nowrap;
					border-bottom: solid 2rpx rgb(238, 238, 238);

					.image_16 {
						margin: 9rpx 0;
					}

					.image_15 {
						width: 37rpx;
						height: 38rpx;
					}

					.text_12 {
						margin: 5rpx 0 7rpx 21rpx;
					}
				}

				.group_20 {
					padding: 36rpx 2rpx 32rpx;
					border-bottom: solid 2rpx rgb(238, 238, 238);

					.group_21 {
						color: rgb(0, 0, 0);
						font-size: 28rpx;
						line-height: 27rpx;
						white-space: nowrap;

						.image_17 {
							width: 36rpx;
							height: 31rpx;
						}

						.text_13 {
							margin-left: 23rpx;
							margin-bottom: 3rpx;
						}
					}

					.view {
						margin: 3rpx 0 4rpx;
					}
				}

				.group_22 {
					padding: 34rpx 2rpx 34rpx 3rpx;

					.group_23 {
						color: rgb(0, 0, 0);
						font-size: 28rpx;
						line-height: 27rpx;
						white-space: nowrap;

						.image_19 {
							width: 35rpx;
							height: 31rpx;
						}

						.text_16 {
							margin-left: 23rpx;
							margin-bottom: 3rpx;
						}
					}

					.view_1 {
						margin-top: 6rpx;
					}
				}

				.right-group {
					color: rgb(182, 180, 180);
					font-size: 24rpx;
					line-height: 24rpx;
					white-space: nowrap;
					display: flex;
					justify-content: flex-end;
					align-items: center;
					flex-wrap: nowrap;
					flex-direction: row;
					width: 300rpx;

					.image_18 {
						margin-left: 10rpx;
					}

					.text_14 {}

					.image_20 {
						margin-left: 10rpx;
						margin-bottom: 4rpx;
					}
				}
			}

			.section_3 {
				margin-top: 16rpx;
				padding-left: 25rpx;
				padding-right: 22rpx;
				background-color: rgb(255, 255, 255);

				.group_24 {
					padding: 34rpx 2rpx 28rpx 3rpx;
					color: rgb(0, 0, 0);
					font-size: 28rpx;
					line-height: 27rpx;
					white-space: nowrap;
					border-bottom: solid 2rpx rgb(238, 238, 238);

					.image_22 {
						margin: 8rpx 0;
					}

					.image_21 {
						width: 35rpx;
						height: 36rpx;
					}

					.text_18 {
						margin: 4rpx 0 6rpx 23rpx;
					}
				}

				.group_26 {
					padding: 34rpx 0 27rpx;
					border-bottom: solid 2rpx rgb(238, 238, 238);

					.image_23 {
						margin: 9rpx 0;
					}

					.text-wrapper {
						padding: 10rpx 0;
						color: rgb(254, 200, 70);
						font-size: 25rpx;
						line-height: 19rpx;
						display: flex;
						justify-content: center;
						align-items: center;
						flex-wrap: nowrap;
						flex-direction: row;
						white-space: nowrap;
						background-image: url('http://images.wanjunshijie.com/product/cook/assets/b8d19cf4e0b8c2cf86b184c474ac89da.png');
						background-size: 100% 100%;
						background-repeat: no-repeat;
						width: 38rpx;
						height: 38rpx;
					}

					.text_20 {
						margin: 5rpx 0 7rpx 22rpx;
						color: rgb(0, 0, 0);
						font-size: 28rpx;
						line-height: 27rpx;
						white-space: nowrap;
					}
				}
			}

			.image_11 {
				width: 12rpx;
				height: 20rpx;
			}
		}
	}
</style>
